<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>个人简介</title>
  <link rel="stylesheet" href="./assets/css/normalize.css">
  <link rel="stylesheet" href="./index.css">
</head>

<body>
  <div class="container">
    <!-- 头部 -->
    <div class="header">
      <img src="./assets/img/header_logo.png" />
    </div>
    <!-- 菜单 -->
    <div class="menu">
      <div class="left">
        <div>个人简介</div>
      </div>
      <div class="right">
        <div>基本信息</div>
        <div>我的家乡</div>
        <div>作品集展示</div>
        <div>给我留言</div>
      </div>
    </div>
    <!-- 基本信息 -->
    <div class="basic-info">
      <div class="left">
        <img src="./assets/img/basic_info_profile.png">
      </div>
      <div class="right">
        <div class="desc">
          <div class="pink-line"></div>
          <div class="desc-box1">
            <p>姓名: 陈紫莲</p>
            <p>性别: 女</p>
            <p>专业: 广告艺术设计</p>
            <p>班级: 2021级2班</p>
            <p>学校: 柳州职业技术学院</p>
          </div>
          <div class="pink-line"></div>
          <div class="desc-box2">
            <p>爱好：探店、摄影、追剧</p>
            <p class="motto">个人简介:</p>
            <p style="line-height: 26px;">希望遥远的你，以及未来的我自己永远真诚，永远守护属于自己的意义</p>
          </div>
        </div>
        <div class="skill">
          <div class="pink-line"></div>
          <p class="s">技能</p>
          <div class="icon-box">
            <img src="./assets/img/basic_info_icon1.png" />
            <img src="./assets/img/basic_info_icon2.png" />
            <img src="./assets/img/basic_info_icon3.png" />
            <img src="./assets/img/basic_info_icon4.png" />
          </div>
          <p>熟练运用ps、AI、cdr、office</p>
        </div>
      </div>
    </div>
    <!-- 分割线 -->
    <div class="line-pink-big"></div>
    <!-- 我的家乡 -->
    <div class="my-hometown">
      <div class="title">我的家乡</div>
      <div class="content">
        <div class="hometown-address">南宁</div>
        <div class="hometown-desc">
          <img src="./assets/img/my_hometown_logo.png" />
          <p>
            南宁市，简称“邕”，古称邕州，别称绿城。广西壮族自治区辖地级市、首府、Ⅰ型大城市、北部湾经济区、珠江—西江经济带和北部湾城市群核心城市、中国—东盟博览会永久举办地、“一带一路”经济带有机衔接的重要门户城市、西部陆海新通道陆港型国家物流枢纽、南部战区陆军机关驻地。
          </p>
        </div>
        <div class="hometown-image">
          <img src="./assets/img/my_hometown_image.png" />
        </div>
      </div>
    </div>
    <!-- 分割线 -->
    <div class="line-pink-big"></div>
    <!-- 作品展示 -->
    <div class="project-show">
      <div class="title">作品展示</div>
      <div class="content">
        <img src="./assets/img/project_1.png" />
        <img src="./assets/img/project_2.png" />
        <img src="./assets/img/project_3.png" />
        <img src="./assets/img/project_4.png" />
      </div>
    </div>
    <!-- 分割线 -->
    <div class="line-pink-big"></div>
    <!-- 给我留言 -->
    <div class="message">
      <div class="title">给我留言</div>
      <div class="form-box">
        <p>联系方式:</p>
        <input type="text" />
        <p>留言内容:</p>
        <textarea cols="30" rows="10">
          </textarea>
        <div class="submit">提交</div>
      </div>
    </div>
  </div>
</body>

</html>